<template>
  <div class="wrapper">
      <div class="top">
          <van-nav-bar
          title="家庭活动记录"
          left-text="返回"
          @click-left="onClickLeft"
          left-arrow
      />
      </div>
      <div class="content">
          <van-cell-group inset>
            <van-field
            v-model="title"
            required
            label="标题"
            />
            <van-field
            v-model="activityname"
            required
            label="活动名称"
            
            />
            <van-field
            required
            label="视图预览"
            v-model="seeView"
            />
            <van-field
            v-model="selectspan"
            required
            label="选择标签"
            
            />
            <van-field
            v-model="thedate"
            required
            label="日期"
            
            />
            <van-field
            v-model="synchronous"
            required
            label="是否同步到社区"
            
            />
          </van-cell-group>
          <div class="twobutton">
            <van-button type="primary"  @click="OnSumbit">完成编辑</van-button>
            <van-button type="warning" @click="OnDelete">删除</van-button>
          </div>
          <div class="bottomContent">
            <van-cell-group inset>
            <van-field
            v-model="teacher"
            required
            label="教师"
            
            />
            <van-field
            required
            label="回复"
            v-model="reply"
            />
            <van-field
            v-model="appraise"
            error
            required
            label="评价"
            
            />
          </van-cell-group>
          </div>
      </div>
  </div>
</template>
<script lang="ts">
import { ref } from 'vue';
import { Toast } from 'vant';
import axios from 'axios';
export default {
  created(){
    this.getActivityData()
  },
  data(){
    return{
      title:"",
      activityname:"",
      seeView:"",
      selectspan:"",
      thedate:"",
      synchronous:"",
      teacher:"",
      reply:"",
      appraise:""
    }
  },
  methods:{
    OnSumbit(){
      Toast.success('编辑成功');
    },
    OnDelete(){
      Toast.success('删除成功');
    },
    getActivityData(){
      axios.get('/activity').then((res)=>{
        console.log(res);
        console.log(res.data.result.data);
        const datalist=res.data.result.data
        datalist.forEach((item)=>{
          if(this.$route.query.title==item.title){
              console.log(123)
              this.title=item.title
              this.activityname=item.activityname
              this.seeView=item.seeView
              this.selectspan=item.selectspan
              this.thedate=item.thedate
              this.teacher=item.teacher
              this.synchronous=item.synchronous
              this.reply=item.reply
              this.appraise=item.appraise
          }
        })
      })
      .catch(function(err){
        console.log(err);
      });
    }
  },
  setup() {
    const onClickLeft = () => history.back();

    return {
      onClickLeft,
    };
  },
};

</script>
<style lang="scss" scoped>
.van-cell{
  border: 1.2px solid #ccc;
}
.analyse{
  margin-top: 15px;
}
#myChart{
  width: 300px;
  height: 300px;
  margin-left: 40px;
}
span{
  margin-left: 15px;
  font-size: 20px;
  font-weight: bold;
}
.van-button--danger{
  margin-top: 20px;
  margin-left: 20px;
  width: 320px;
}
.van-button--primary{
  margin-top: 20px;
  margin-left: 20px;
  width: 120px;
}
.van-button--warning{
  margin-top: 20px;
  margin-left: 60px;
  width: 130px;
}
/deep/ .van-button--mini {
  margin-left: 120px; 
  width: 50px;
}
.bottomContent{
  margin-top: 20px;
}
</style>